﻿@model TumbaloSoft.Models.MyViewModel
@{
    Layout = "~/Views/Shared/_HomeLayout.cshtml";
    ViewBag.Title = "Registrar Cita";
}

<script>
    $(function () {
        $("#datepicker").datepicker({
            changeMonth: true,
            changeYear: true, dateFormat: 'dd/mm/yy'
        });
    });
</script>

<script>
    // increase the default animation speed to exaggerate the effect
    //$.fx.speeds._default = 4000;
    $(function () {
        $("#dialog").dialog({
            autoOpen: false,
            resizable: false,
            height: 240,
            modal: true,
            buttons: {
                "Si": function () {
                    $("#form_1").submit();
                    $(this).dialog('close');
                },

                "No": function () {
                    $(this).dialog("close");
                }
            }
        });

        $("#open").click(function () {
            $("#dialog").dialog("open");
            return false;
        });


    });
</script>



<!-- content -->
		<div class="body2">
			<div class="main">
				<section id="content">
					<div class="wrapper">
						
						<!--Formulario-->
					    <article class="col1" style="width: 500px">
						    <form id="form_1" method="post" style="height: 100%">
							    <div class="pad1">
								    <h3>Registrar Cita</h3>

                                    <!--RADIO:TIPO DE PERSONA-->
                                    <div class="row_select">
                                        <table style="width:420px">
                                            <tr>
                                                <td style="width: 210px"><span>Tipo Persona:</span></td>
                                                <td style="width: 210px">   
                                                    <select name="tipoPersona">                                 
                                                            <option value=1>Natural</option>
                                                            <option value=2>Juridica</option>
                                                    </select>
                                                </td>                                              
                                            </tr>
                                        </table>                                                    
                                    </div>
                                    

                                    <!--NOMBRE-->
                                    <div class="row">
                                        <table style="width: 420px">
                                            <tr>
                                                <td style="width: 210px"><span>Nombre o Razon Social*:</span></td>
                                                <td style="width: 210px">
                                                    @Html.TextBoxFor(model=>model.PersonaNatural.prNombre, new { @class = "input", maxlength = "30", placeholder = "Maximo 30 caracteres aqui" })
                                                    @Html.ValidationMessageFor(model=>model.PersonaNatural.prNombre, null)
                                                </td>
                                            </tr>
                                        </table>
                                    </div>
                                    
                                    <!--EMAIL-->
                                    <div class="row">
                                        <table style="width: 420px">
                                            <tr>
                                                <td style="width: 210px"><span>Email*:</span></td>
                                                <td style="width: 210px">
                                                    @Html.TextBoxFor(model => model.Persona.prEmail, new { @Class = "input", placeholder = "ejemplo@dominio.com" })
                                                            @Html.ValidationMessageFor(model => model.Persona.prEmail, null)
                                                </td>
                                            </tr>
                                        </table>
                                    </div>


                                    <!--TELEFONO-->
                                    <div class="row">
                                        <table style="width: 420px">
                                            <tr>
                                                <td style="width: 210px"><span>Teléfono:</span></td>
                                                <td style="width: 210px"> 
                                                    @Html.TextBoxFor(model => model.Persona.prTelefono, new { @Class = "input", maxlength = "9", minlength = "9" })
                                                    @Html.ValidationMessageFor(model => model.Persona.prTelefono, null)
                                                </td>
                                            </tr>
                                        </table> 
                                    </div>
										
                                    <!--LUGAR-->
                                    <div class="row_select">
                                        <table style="width:420px">
                                            <tr>
                                                <td style="width: 210px"><span>Distrito:</span></td>
                                                <td style="width: 210px">   
                                                    <select name="idDistrito">                                                         
                                                        @foreach (var objTipo1 in ViewBag.listaDistrito)
                                                        {                                                        
                                                            <option value="@objTipo1.prIdDistrito">@objTipo1.prNombreDistrito</option>
                                                        }
                                                    </select>
                                                </td>                                              
                                            </tr>
                                        </table>                                                    
                                    </div>

                                    

                                    <!--HORA-->
                                    <div class="row_select">
                                        <table style="width:420px">
                                            <tr>
                                                <td style="width: 210px"><span>Hora*:</span></td>
                                                <td style="width: 210px">   
                                                    <select name="hora">                                 
                                                            <option value=10>10:00 AM</option>
                                                            <option value=11>11:00 AM</option>
                                                            <option value=12>12:00 PM</option>
                                                            <option value=13>1:00 PM</option>
                                                            <option value=14>2:00 PM</option>
                                                            <option value=15>3:00 PM</option>
                                                            <option value=16>4:00 PM</option>
                                                            <option value=17>5:00 PM</option>                                                        
                                                    </select>
                                                    @Html.ValidationMessageFor(model=>model.Cita.prHora,null)                                                           
                                                </td>                                              
                                            </tr>
                                        </table>                                                    
                                    </div>

                                    <!--POSIBLEFECHA-->
                                    <div class="row">
                                        <table style="width: 420px">
                                            <tr>
                                                <td style="width: 210px"><span>Posible Fecha*:</span></td>
                                                <td style="width: 210px"> 
                                                    <input class="input" id="datepicker"  name="prFecha"/> 
                                                    @Html.ValidationMessageFor(model=>model.Cita.prFecha,null)                                                           
                                                </td>
                                            </tr>
                                        </table>                                                
                                    </div>

                                    <!--MENSAJE-->
                                    <div class="row">
                                        <table style="width: 420px">
                                            <tr>
											    <td style="width: 173px"><span>Mensaje:</span></td>
                                                <td>
                                                    @Html.TextAreaFor(model => model.Cita.prMensaje, new { style="margin-left: 117px; width: 214px; height: 115px; margin-right: 27px;" })
                                                    @Html.ValidationMessageFor(model => model.Cita.prMensaje,null,new {@Class="message",style="margin-left:84px;width:178px" })   
                                                </td>
                                            </tr>
                                        </table> 
									</div>


                                    <!--Botones everywhere-->
                                <table style="width: 500px">
                                    <tr>
                                        <td style="width: 167px">
									<div id="dialog" title="Nueva Cita">
                                                    <p>Esta seguro que desea guardar los datos de la cita?</p>                                                    
                                                    <!--<a href="#" id="opener"  class="button" onClick="document.getElementById('form_1').submit()">Guardar</a>-->
                                                </div>

                                                <button id="open"  class="button">Guardar</button>

                                        </td>
                                        <td style="width: 166px"><a href="#" class="button" onclick="document.getElementById('form_1').reset()">Limpiar</a></td>
                                        <td style="width: 167px"><a href="javascript:history.go(-1)" class="button" onclick="document.getElementById('form_1').cancel()">Cancelar</a></td>
                                    </tr>
                                </table>
                                <br>
                                <br>
                                </div>
                            </form>
                        </article>
					</div>
					
				</section>
			</div>
		</div>
<!-- / content -->
		
		<script type="text/javascript"> Cufon.now(); </script>
    